<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>svg</title>
    <style>
      .svg {
        background-color: gray;
      }
    </style>
  </head>
  <body>
    <svg class="svg" width="1200" height="400">
      <line x1="100" y1="100" x2="200" y2="200" stroke="#000" />

      <!-- <polyline
        points="100 200, 200 300, 300 200"
        stroke="#000"
        fill-opacity="0"
      /> -->

      <polygon
        points="100 200, 200 300, 300 200"
        stroke="#000"
        fill-opacity="0"
      />

      <rect
        x="310"
        y="100"
        width="200"
        height="100"
        fill-opacity="0"
        stroke="#000"
      />

      <circle cx="350" cy="300" r="50" fill="green" stroke="#000" />

      <ellipse
        cx="700"
        cy="200"
        rx="100"
        ry="50"
        fill-opacity="0"
        stroke="#000"
      />

      <path
        d="
          M 800 200
          L 1000 200
          L 840 350
          L 900 130
          L 960 350
          Z
        "
        fill-opacity="0"
        stroke="#000"
      />
    </svg>

    <svg viewBox="0 0 1024 1024" width="20" height="20">
      <path
        d="M667.786667 117.333333C832.864 117.333333 938.666667 249.706667 938.666667 427.861333c0 138.250667-125.098667 290.506667-371.573334 461.589334a96.768 96.768 0 0 1-110.186666 0C210.432 718.368 85.333333 566.112 85.333333 427.861333 85.333333 249.706667 191.136 117.333333 356.213333 117.333333c59.616 0 100.053333 20.832 155.786667 68.096C567.744 138.176 608.170667 117.333333 667.786667 117.333333z m0 63.146667c-41.44 0-70.261333 15.189333-116.96 55.04-2.165333 1.845333-14.4 12.373333-17.941334 15.381333a32.32 32.32 0 0 1-41.770666 0c-3.541333-3.018667-15.776-13.536-17.941334-15.381333-46.698667-39.850667-75.52-55.04-116.96-55.04C230.186667 180.48 149.333333 281.258667 149.333333 426.698667 149.333333 537.6 262.858667 675.242667 493.632 834.826667a32.352 32.352 0 0 0 36.736 0C761.141333 675.253333 874.666667 537.6 874.666667 426.698667c0-145.44-80.853333-246.218667-206.88-246.218667z"
        fill="#d81e06"
      ></path>
    </svg>
  </body>
</html>
